<template>
  <div>
    <div class="top">
      <div>
        <router-link to="/emit"><img src="../../img/设置.png" alt="" class="she"></router-link>
      </div>
      <div class="user-top">
        <p>
          <img src="../../img//user.jpg" alt="" class="user">
          <span class="name">ms3VW6mIEY</span>
        </p>
        
      </div>
      <div class="hui">
        <img src="../../img/会员中心.png" alt="" class="hui-img">
        <span class="hui-span">会员</span>
        <button class="hui-btn">权益中心</button>
      </div>
    </div>
    <div class="box">
      <div @click="zxwz">
        <img src="../../img/a1_03.png" alt="">
        <span>在线问诊</span>
      </div>
      <div @click="jkda">
        <img src="../../img/a1_05.png" alt="">
        <span>健康档案</span>
      </div>
      <div @click="yyjy">
        <img src="../../img/a1_09.png" alt="">
        <span>用药建议</span>
      </div>
      <div @click="yxdd">
        <img src="../../img/a1_10.png" alt="">
        <span>优选订单</span>
      </div>
      <div @click="wdys">
        <img src="../../img/a1_13.png" alt="">
        <span>我的医生</span>
      </div>
      <div @click="sfjh">
        <img src="../../img/a1_14.png" alt="">
        <span>随访计划</span>
      </div>
    </div>
    <div class="tit">
      <van-cell is-link title="商品订单" class="cell">
        <span class="sp"><img src="../../img/mine-cart.jpg" alt=""
            style="margin-top: 10px;width: 30px;height:30px;"></span>
      </van-cell>
      <van-cell is-link title="挂号订单" class="cell"></van-cell>
      <van-cell is-link title="收货地址" class="cell"></van-cell>
      <van-cell is-link title="我的卡券" class="cell"></van-cell>
      <van-cell is-link title="门诊预约" class="cell"></van-cell>
      <van-cell is-link title="商品收藏" class="cell"></van-cell>
    </div>
  </div>
</template>
<script setup lang="ts">
// 跳转在线问诊页面
const zxwz=()=>{
  window.location.href = '/zxwz'
}
// 跳转健康档案页面
const jkda=()=>{
  window.location.href = '/jkda'
}
// 跳转用药建议页面
const yyjy=()=>{
  window.location.href = '/yyjy'
}
// 跳转优选订单页面
const yxdd=()=>{
  window.location.href = '/yxdd'
}
// 跳转我的医生页面
const wdys=()=>{
  window.location.href = '/wdys'
}
// 跳转随访计划页面
const sfjh=()=>{
  window.location.href = '/sfjh'
}
</script>
<style scoped>
.top{
  width: 100%;
  height: 150px;
  background: linear-gradient(to bottom, rgb(223, 238, 238), #eae8e8);
}
.she {
  width: 20px;
  height: 20px;
  position: fixed;
  right: 20px;
  top: 40px;
  font-size: 20px;
}

.user-top {
  width: 100%;
  height: 80px;
  margin-top: 40px;
  align-items: center;
}

.user {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  margin-left: 15px;
  margin-top: 15px;
}

.name {
  margin-left: 10px;
  position: fixed;
  top: 70px;
  /* align-items: center; */
}

.hui {
  width: 94%;
  height: 70px;
  background-color: #000;
  position: relative;
  margin-left: 3%;
  border-radius: 10px;
  font-size: 30px;
}

.hui-img {
  width: 30px;
  height: 30px;
  margin-top: 10px;
  margin-left: 10px;
}

.hui-span {
  position: absolute;
  color: bisque;
  font-weight: 500;
  margin-top: 15px;
  margin-left: 10px;
}

.hui-btn {
  width: 75px;
  height: 26px;
  border-radius: 13px;
  background-color: bisque;
  border: none;
  position: absolute;
  right: 15px;
  top: 13px;
  font-size: 13px;
}

.box {
  width: 100%;
  height: 300px;
  background-color: #eae8e8;
}

.box>div {
  width: 47%;
  height: 70px;
  border-radius: 5px;
  background-color: #fff;
  float: left;
  margin-left: 2%;
  margin-top: 15px;
  position: relative;
   font-size: 35px;
  
}

.box>div>img {
  width: 30px;
  height: 30px;
  margin-top: 10px;
  margin-left: 10px;
}

.box>div>span {
  align-items: center;
  position: absolute;
  top: 15px;
  left: 50px;
  font-weight: 600;
}

.tit {
  font-size: 16px;
  font-weight: 600;

}

.cell {
  height: 42px;
  align-items: center;
  font-size: 40px;
  border-bottom: 1px solid #ccc;
  margin-top: 50px;
}
</style>
